<script>
/* eslint-disable */
import ButtonList from '@/components/ButtonList'
import addtable from '@/mixins/addtable'
import WrapTable from '@/components/WrapTable'

import TableButtonList from '@/components/TableButtonList'
import SearchForm from '@/components/SearchForm'
import request from '@/utils/request'

import AjaxStore from '@/utils/store/proxyAjax'
import DialogForm from '@/components/DialogForm'
import RolePersonFenpei from './rolePersonFenpei/index.vue'
import RoleAuthorize from './roleAuthorize/roleAuthorize.vue'
import DataGroupConfig from './dataGroupConfig/dataGroupConfig.vue'
import { mapGetters } from 'vuex'
import store from './store.js'

export default {
  name: 'role-manage',
  mixins: [addtable, store],
  // mixins: [addtable, store, commonBreadCrumb, emitter],
  components: {
    WrapTable,
    SearchForm,
    TableButtonList,
    RolePersonFenpei,
    RoleAuthorize,
    DataGroupConfig
  },
  computed: {
    ...mapGetters(['enabledDatagroup', 'projectName']),
    dialogConfigTitle() {
      return `${this.projectName}-数据组配置`;
    },
  },
  created() {
    var sessionObj = sessionStorage.getItem('userInfo_tc_admin_web')
    var userInfo = JSON.parse(sessionObj)
    if (userInfo.project) {
      var projectId = userInfo.project.projectId
      if (projectId) {
        this.projectId = projectId
        this.roleAuthorizeUrl = '/v1/sys/role/grantProjectFunction'
      }
    }

    return this.projectId
      ? '/v1/sys/role/findAllProjectFunNodeTree'
      : '/v1/sys/role/findAllFunNodeTree'
  },
  provide() {
    return {
      role: this
    }
  },
  data() {
    return {
      tableOptWidth: '160',
      dialogType: '',
      dialogFenpeiTitle: '人员分配',
      dialogAuthorizeTitle: '角色授权',
      idKey: 'roleId',
      delIdKey: 'roleId',
      delListIdKey: 'roleIds',
      roleId: '',
      roleName: '',
      file: '',
      fileList: [],
      containerData: '',
      showInputFlag: true,
      inputPlaceholder: '输入角色名称搜索',
      tableSelectionObj: { selectable: this.partTableSelectionColForbid }, // 实现表格部分勾选框依据条件禁用

      addUrl: '/v1/sys/role/add',
      updateUrl: '/v1/sys/role/update',
      delUrl: '/v1/sys/role/delete',
      delListUrl: '/v1/sys/role/deleteList',
      roleAuthorizeUrl: '/v1/sys/role/grantFunction',
      fenpeiUrl: '/v1/sys/role/grantRoleToUsers',
      getFenpeiUserInfoUrl: '/v1/sys/role/findUsersById',
      getRoleAuthorizeInfoUrl: '/v1/sys/role/findAllFunNodeTree',
      updateActDataUrl: "/v1/sys/role/updateActData",
      importUrl: '/v1/sys/role/importRole',
      url: '/v1/sys/role/findById',
      store: new AjaxStore({
        url: '/v1/sys/role/query'
      }),
      columns: [
        {
          prop: 'roleCode',
          label: '角色编码',
          sortable: true,
          width: '140',
          'show-overflow-tooltip': true,
          'header-align': 'center'
        },
        {
          prop: 'roleName',
          label: '角色名称',
          sortable: true,
          width: '140',
          'show-overflow-tooltip': true,
          'header-align': 'center'
        },
        {
          prop: 'dataStatus',
          label: '状态',
          sortable: true,
          width: '100',
          'header-align': 'center',
          formatter: (row, column, cellValue) => (cellValue ? '启用' : '停用')
        },
        {
          prop: 'grantUsers',
          label: '已分配人员',
          sortable: true,
          'min-width': '240',
          'header-align': 'center',
          'show-overflow-tooltip': true,
          scopedSlots: {
            default: ({ row }) =>
              row.grantUsers ? <div>{row.grantUsers}</div> : ''
          }
        }
      ],
      searchFields: [],
      searchModel: {},
      searchBtnList: [],
      toolPanelBtnList: this.toolPanelBtns,
      tableRowBtnList: this.tableRowBtnList,
      formPanel: {
        add: {
          model: {
            projectId: '',
            roleId: '',
            roleCode: '（自动生成）',
            roleName: '',
            dataStatus: 1,
            json: '',
            version: '',
            creator: '',
            createdTime: '',
            updator: '',
            updatedTime: '',
            remark: '',
            grantUsers: ''
          },
          fields: [
            // { label: '项目ID', prop: 'projectId', placeholder: '输入项目ID', anchor: 24},
            // { label: '角色ID', prop: 'roleId', placeholder: '输入角色ID', anchor: 24},
            {
              label: '角色编码',
              prop: 'roleCode',
              placeholder: '输入角色编码',
              anchor: 24,
              focus: true
            },
            {
              label: '角色名称',
              prop: 'roleName',
              placeholder: '输入角色名称',
              anchor: 24
            },
            {
              label: '状态',
              prop: 'dataStatus',
              xType: 'switch',
              anchor: 24,
              'active-value': 1,
              'inactive-value': 0
            },
            // { label: '状态', prop: 'dataStatus', xType: 'SelectCode.ENABLED', placeholder: '输入状态', anchor: 24},
            // { label: 'JSON字段', prop: 'json', placeholder: '输入JSON字段', anchor: 24},
            // { label: '版本', prop: 'version', placeholder: '输入版本', anchor: 24},
            // { label: '创建人', prop: 'creator', placeholder: '输入创建人', anchor: 24},
            // { label: '创建时间', prop: 'createdTime', placeholder: '输入创建时间', anchor: 24},
            // { label: '更新人', prop: 'updator', placeholder: '输入更新人', anchor: 24},
            // { label: '更新时间', prop: 'updatedTime', placeholder: '输入更新时间', anchor: 24},
            {
              label: '描述',
              prop: 'remark',
              placeholder: '输入备注',
              anchor: 24,
              type: 'textarea',
              rows: 2
            }
            // { label: '授予用户', prop: 'grantUsers', placeholder: '输入授予用户', anchor: 24}
          ],
          rules: {
            roleCode: [
              { required: true, message: '请输入角色编码', trigger: 'blur' }
            ],
            roleName: [
              { required: true, message: '请输入角色名称', trigger: 'blur' }
            ],
            dataStatus: [
              { required: true, message: '请输入角色名称', trigger: 'blur' }
            ]
            //  "creator": [{ required: true, message: '请输入创建人', trigger: 'blur' }],
            //  "createdTime": [{ required: true, message: '请输入创建时间', trigger: 'blur' }],
          },
          title: '新增角色',
          type: 'ADD',
          ref: 'addForm',
          submitBtnList: this.addBtns
        },
        edit: {
          model: {
            projectId: '',
            roleId: '',
            roleCode: '',
            roleName: '',
            dataStatus: 0,
            json: '',
            version: '',
            creator: '',
            createdTime: '',
            updator: '',
            updatedTime: '',
            remark: '',
            grantUsers: '',
            aclId: 0
          },
          fields: [
            //  { label: '项目ID', prop: 'projectId', placeholder: '输入项目ID', anchor: 24},
            //  { label: '角色ID', prop: 'roleId', placeholder: '输入角色ID', anchor: 24},
            {
              label: '角色编码',
              prop: 'roleCode',
              placeholder: '输入角色编码',
              anchor: 24,
              focus: true
            },
            {
              label: '角色名称',
              prop: 'roleName',
              placeholder: '输入角色名称',
              anchor: 24
            },
            // {
            //   label: '小程序权限',
            //   prop: 'aclId',
            //   placeholder: '小程序权限',
            //   xType: 'SelectConfig.USER',
            //   multiple: false,
            //   filterable: true,
            //   anchor: 24,
            //   isLocal: false,
            //   ref: 'addManager',
            //   getData: () => {
            //     console.log('aclBtn')
            //     return request({
            //       url: '/v1/test/aclbtn/query',
            //       method: 'get'
            //     }).then(({ data }) => {
            //       return data.map(item => {
            //         return {
            //           // value: /\d+/.test(item.codeValue) ? parseInt(item.codeValue) : item.codeValue,
            //           value: /^\d+$/.test(item.aclId)
            //             ? parseInt(item.aclId)
            //             : item.aclId + '',
            //           label: item.aclName,
            //           ...item
            //         }
            //       })
            //     })
            //   },
            //   on: {
            //     'visible-change': val => {
            //       // val && this.$refs.addForm.$refs.addManager.load()
            //     }
            //   }
            // },
            {
              label: '状态',
              prop: 'dataStatus',
              xType: 'switch',
              anchor: 24,
              'active-value': 1,
              'inactive-value': 0
            },
            //  { label: '状态', prop: 'dataStatus', xType: 'SelectCode.ENABLED', placeholder: '输入状态', anchor: 24},
            //  { label: 'JSON字段', prop: 'json', placeholder: '输入JSON字段', anchor: 24},
            //  { label: '版本', prop: 'version', placeholder: '输入版本', anchor: 24},
            //  { label: '创建人', prop: 'creator', placeholder: '输入创建人', anchor: 24},
            //  { label: '创建时间', prop: 'createdTime', placeholder: '输入创建时间', anchor: 24},
            //  { label: '更新人', prop: 'updator', placeholder: '输入更新人', anchor: 24},
            //  { label: '更新时间', prop: 'updatedTime', placeholder: '输入更新时间', anchor: 24},
            {
              label: '描述',
              prop: 'remark',
              placeholder: '输入备注',
              anchor: 24,
              type: 'textarea',
              rows: 2
            }
            // { label: '授予用户', prop: 'grantUsers', placeholder: '输入授予用户', anchor: 24}
          ],
          rules: {
            roleCode: [
              { required: true, message: '请输入角色编码', trigger: 'blur' }
            ],
            roleName: [
              { required: true, message: '请输入角色名称', trigger: 'blur' }
            ],
            dataStatus: [
              { required: true, message: '请输入状态', trigger: 'blur' }
            ]
            //  "creator": [{ required: true, message: '请输入创建人', trigger: 'blur' }],
            //  "createdTime": [{ required: true, message: '请输入创建时间', trigger: 'blur' }],
          },
          title: '编辑角色',
          type: 'EDIT',
          ref: 'editForm',
          submitBtnList: this.editBtns
        },
        look: {
          model: {
            projectId: '',
            roleId: '',
            roleCode: '',
            roleName: '',
            dataStatus: 0,
            json: '',
            version: '',
            creator: '',
            createdTime: '',
            updator: '',
            updatedTime: '',
            remark: '',
            grantUsers: ''
          },
          fields: [
            {
              label: '角色编码',
              prop: 'roleCode',
              placeholder: '',
              anchor: 24,
              disabled: true
            },
            {
              label: '角色名称',
              prop: 'roleName',
              placeholder: '',
              anchor: 24,
              disabled: true
            },
            {
              label: '状态',
              prop: 'dataStatus',
              xType: 'SelectCode.ENABLED',
              placeholder: '',
              anchor: 24,
              disabled: true
            },
            {
              label: '描述',
              prop: 'remark',
              placeholder: '',
              anchor: 24,
              disabled: true,
              type: 'textarea',
              rows: 2
            }
            // { label: '授予用户', prop: 'grantUsers', placeholder: '输入授予用户', anchor: 24}
          ],
          rules: {},
          title: '查看角色',
          type: 'LOOK',
          ref: 'lookForm',
          submitBtnList: this.lookBtns
        }
      }
    }
  },
  methods: {
    // 表格部分勾选框依据条件禁用
    partTableSelectionColForbid(row, index) {
      if (row.roleId === 1) {
        return 0
      } else {
        return 1
      }
    },
    handleInputClick(ev, val) {
      const params = {}
      params.q_roleName = val
      this.store._searchParams = params
      this.$refs.table.load(1, this.store.limit)
    },
    handleAuthorize(model) {
      this.roleName = model.roleName
      this.roleId = model.roleId
      this.dialogType = 'AUTHORIZE'
      this.$nextTick(() => {
        this.$refs.RoleAuthorize.roleId = this.roleId
        this.$refs.RoleAuthorize.currentLabelValue = this.roleName
      })
    },
    handleAuthorizeSubmit() {
      const params = {}
      params.roleId = this.roleId
      params.funIds = this.$refs.RoleAuthorize.getHalfANdAllCheckedList()
        .map(item => {
          return item
        })
        .join(',')
      // 加载 loading
      const loading = this.$loading({
        fullscreen: true,
        text: '请求发送中，请稍候',
        customClass: 'roleAuthorLoading'
      })
      this.roleAuthorize(params)
        .then(({ success, message }) => {
          if (success) {
            this.$message({
              type: 'success',
              message: message
            })
            this.dialogType = ''
          } else {
            this.$message({
              type: 'error',
              message: message
            })
          }
        })
        .catch(error => {
          console.log(error)
        })
        .then(() => {
          // 以服务的方式调用的 Loading 需要异步关闭
          this.$nextTick(() => {
            loading.close()
          })
        })
    },
    handleAuthorizeCancel() {
      this.$refs.RoleAuthorize.$refs.tree.emptyChecked()
      this.dialogType = ''
    },
    handleFenpei(model) {
      this.roleName = model.roleName
      this.roleId = model.roleId
      this.dialogType = 'FENPEI'
    },
    handleConfig(model) {
      this.roleId = model.roleId;
      this.dialogType = "CONFIG";
    },
    handleConfigCancel() {
      this.$refs.DataGroupConfig.handleEmptySelectedList();
      this.dialogType = "";
    },
    handleConfigSubmit() {
      const params = {};
      params.actDataids = this.$refs.DataGroupConfig.handleReturnSelectedList()
        .map(item => {
          return item.datagroupId;
        })
        .join("#");
      params.roleId = this.roleId;
      this.updateDataGroupConfig(params)
        .then(({ success, message }) => {
          if (success) {
            this.$message({
              type: "success",
              message: "数据组分配成功！"
            });
            this.dialogType = "";
            this.$refs.table.load(1);
          } else {
            this.$message({
              type: "error",
              message: "数据组分配失败！"
            });
          }
        })
        .catch(error => {
          console.log(error);
        });
    },
    handleFenpeiSubmit() {
      this.selectedList = this.$refs.RolePersonFenpei.handleReturnSelectedList()
      const params = {}
      params.roleId = this.roleId
      params.userIds = this.selectedList
        .map(item => {
          return item.userId
        })
        .join(',')
      params.deptIds = this.selectedList
        .map(item => {
          return item.deptId
        })
        .join(',')

      console.log('userIds:' + params.userIds)
      console.log('deptIds:' + params.deptIds)
      console.log('roleId:' + params.roleId)

      this.fenpei(params)
        .then(({ success, message }) => {
          if (success) {
            this.$refs.table.load(1)
            this.$message({
              type: 'success',
              message: message
            })
            this.dialogType = ''
          } else {
            this.$message({
              type: 'error',
              message: message
            })
          }
        })
        .catch(error => {
          console.log(error)
        })
    },
    handleFenpeiCancel() {
      this.$refs.RolePersonFenpei.handleEmptySelectedList()
      this.dialogType = ''
    },
    handleImportRole() {
      this.$confirm('导入后会覆盖原有数据，是否继续？', '提示', {
        cancelButtonText: '取消',
        confirmButtonText: '确定',
        type: 'warning'
      }).then(() => {
        this.$refs.upload.$refs['upload-inner'].$refs.input.click()
      })
    },
    handleFileChange(file, fileLists) {
      this.fileList = []
      for (var i = 0; i < fileLists.length; i++) {
        this.fileList.push(fileLists[i].raw)
      }
      // 取出相同文件的文件名
      var files = this.fileList
      for (var i = 0; i < files.length; i++) {
        var fileName = files[i].name
        for (var j = 0; j < files.length; j++) {
          if (fileName == files[j].name && !i == j) {
            this.$message({
              type: 'error',
              message: '请勿上传相同的文件'
            })
          }
        }
      }
      this.file = file.raw
    },
    renderUpload(h) {
      return [
        <c-upload
          class='upload-file'
          ref='upload'
          auto-upload={true}
          action='/v1/yq/projectfunction/import'
          accept={this.acceptFileType}
          list-type='picture'
          name='file'
          limit={1}
          {...{
            props: {
              onChange: this.handleFileChange,
              httpRequest: this.handleHttpRequest
              // onSuccess: this.handleFileSuccess,
              // onError: this.handleFileError
            }
          }}></c-upload>
      ]
    },
    handleHttpRequest() {
      const formData = new FormData()
      formData.append('file', this.file)
      var that = this
      return new Promise((resolve, reject) => {
        this.import(formData, this.importUrl)
          .then(({ success, message }) => {
            this.$message({
              type: success ? 'success' : 'error',
              message
            })
            this.$refs.upload.fileList && this.$refs.upload.fileList.splice(0)
            if (success) {
              this.$refs.table.load(1)

              resolve()
            } else {
              throw new Error(message)
            }
          })
          .catch(err => {
            this.$refs.upload.fileList && this.$refs.upload.fileList.splice(0)
            console.log(err)
            reject(err)
          })
      })
    },
    // 定义操作列按钮
    renderOperateBtns(row) {
      if (this.enabledDatagroup === '0'){
        <TableButtonList
          operateBtnList={
            row.roleId === 1
              ? this.tableRowBtnListWithoutEditDel
              : this.tableRowBtnList
          }
          props-model={row}></TableButtonList>
      } else {
        return <TableButtonList
          operateBtnList={
            this.projectId ? 
              this.tableRowBtnList2 
            : row.roleId === 1 ? 
            this.tableRowBtnListWithoutEditDel
              : this.tableRowBtnList}
          props-model={row}></TableButtonList>
      }
    },
    // eslint-disable-next-line
    renderCustom(h) {
      return [
        <DialogForm
          visible={this.dialogType === 'FENPEI'}
          width='1200px'
          title={this.dialogFenpeiTitle}
          on-close={this.handleFenpeiCancel}>
          <RolePersonFenpei
            roleId={this.roleId}
            roleName={this.roleName}
            ref='RolePersonFenpei'></RolePersonFenpei>
          <c-form ref='form' slot='footer'>
            <c-form-item class='submit-btn'>
              <ButtonList
                operateBtnList={this.FenpeiBtns}
                props-model={this.searchModel}></ButtonList>
            </c-form-item>
          </c-form>
        </DialogForm>,
        <DialogForm
          class='role-authorize-dialog'
          visible={this.dialogType === 'AUTHORIZE'}
          width='660px'
          title={this.dialogAuthorizeTitle}
          on-close={this.handleAuthorizeCancel}>
          <RoleAuthorize ref='RoleAuthorize'></RoleAuthorize>
          <c-form ref='form' slot='footer'>
            <c-form-item class='submit-btn'>
              <ButtonList
                operateBtnList={this.AuthorizeBtns}
                props-model={this.searchModel}></ButtonList>
            </c-form-item>
          </c-form>
        </DialogForm>,
        <DialogForm
          visible={this.dialogType === "CONFIG"}
          width="750px"
          title={this.dialogConfigTitle}
          on-close={this.handleConfigCancel}
        >
          <DataGroupConfig ref="DataGroupConfig" />
          <c-form ref="form" slot="footer">
            <c-form-item class="submit-btn">
              <ButtonList
                operateBtnList={this.ConfigBtns}
                props-model={this.searchModel}
              />
            </c-form-item>
          </c-form>
        </DialogForm>
      ]
    }
  },
  beforeCreate() {
    const urlArr = ((this.$route.meta && this.$route.meta.children) || []).map(
      item => item.url
    )

    this.addBtns = [
      {
        label: '保存',
        methods: 'handleAddSubmit',
        url: '/v1/sys/role/add',
        icon: 'el-icon-circle-check',
        type: 'primary',
        disabled: false
      },
      {
        label: '取消',
        methods: 'handleCancel',
        url: '',
        icon: 'el-icon-circle-close',
        disabled: false
      }
    ].filter(item => (item.url && urlArr.includes(item.url)) || !item.url)

    this.editBtns = [
      {
        label: '保存',
        methods: 'handleEditSubmit',
        url: '/v1/sys/role/update',
        icon: 'el-icon-circle-check',
        type: 'primary',
        disabled: false
      },
      {
        label: '取消',
        methods: 'handleCancel',
        url: '',
        icon: 'el-icon-circle-close',
        disabled: false
      }
    ].filter(item => (item.url && urlArr.includes(item.url)) || !item.url)

    this.lookBtns = [
      {
        label: '保存',
        methods: '',
        url: '',
        icon: 'el-icon-circle-check',
        type: 'primary',
        disabled: true
      },
      {
        label: '取消',
        methods: 'handleCancel',
        url: '',
        icon: 'el-icon-circle-close',
        disabled: false
      }
    ].filter(item => (item.url && urlArr.includes(item.url)) || !item.url)

    this.toolPanelBtns = [
      {
        label: '新增',
        methods: 'handleAdd',
        url: '/v1/sys/role/add',
        icon: 'el-icon-circle-plus-outline',
        type: 'primary',
        disabled: false
      },
      {
        label: '导入',
        methods: 'handleImportRole',
        url: '/v1/sys/user/importRole',
        svgIcon: 'import',
        type: 'import',
        diabled: false
      },
      {
        label: '删除',
        methods: 'handleDelGroup',
        url: '/v1/sys/role/deleteList',
        icon: 'el-icon-delete',
        type: 'danger',
        disabled: false
      }
    ].filter(item => (item.url && urlArr.includes(item.url)) || !item.url)

    this.ConfigBtns = [
      {
        label: "保存",
        methods: "handleConfigSubmit",
        url: "",
        icon: "el-icon-circle-check-outline",
        type: "primary",
        disabled: false
      },
      {
        label: "取消",
        methods: "handleConfigCancel",
        url: "",
        icon: "el-icon-circle-close-outline",
        disabled: false
      }
    ].filter(item => (item.url && urlArr.includes(item.url)) || !item.url);
    
    this.tableRowBtnList = [
      {
        label: '编辑',
        methods: 'handleEdit',
        url: '/v1/sys/role/update',
        icon: 'el-icon-edit-outline',
        type: 'primary',
        key: 'edit',
        align: 'top-start',
        disabled: false
      },
      {
        label: '删除',
        methods: 'handleDelete',
        url: '/v1/sys/role/delete',
        icon: 'el-icon-delete',
        type: 'danger',
        key: 'delete',
        align: 'top-start',
        disabled: false
      },
      {
        label: '角色授权',
        methods: 'handleAuthorize',
        url: '/v1/sys/role/grantFunction',
        svgIcon: 'roleauthorize',
        type: '',
        key: 'authorize',
        align: 'top-start',
        disabled: false
      },
      {
        label: '人员分配',
        methods: 'handleFenpei',
        url: '/v1/sys/role/grantRoleToUsers',
        svgIcon: 'rolepersonfenpei',
        type: '',
        key: 'fenpei',
        align: 'top-start',
        disabled: false
      }
    ].filter(item => (item.url && urlArr.includes(item.url)) || !item.url)

    this.tableRowBtnList2 = [
      {
        label: '编辑',
        methods: 'handleEdit',
        url: '/v1/sys/role/update',
        icon: 'el-icon-edit-outline',
        type: 'primary',
        key: 'edit',
        align: 'top-start',
        disabled: false
      },
      {
        label: '删除',
        methods: 'handleDelete',
        url: '/v1/sys/role/delete',
        icon: 'el-icon-delete',
        type: 'danger',
        key: 'delete',
        align: 'top-start',
        disabled: false
      },
      {
        label: '角色授权',
        methods: 'handleAuthorize',
        url: '/v1/sys/role/grantFunction',
        svgIcon: 'roleauthorize',
        type: '',
        key: 'authorize',
        align: 'top-start',
        disabled: false
      },
      {
        label: '人员分配',
        methods: 'handleFenpei',
        url: '/v1/sys/role/grantRoleToUsers',
        svgIcon: 'rolepersonfenpei',
        type: '',
        key: 'fenpei',
        align: 'top-start',
        disabled: false
      },
      {
        label: "数据组配置",
        methods: "handleConfig",
        url: "/v1/sys/role/updateActData",
        svgIcon: "datagroupconfig",
        type: "",
        key: "fenpei",
        align: "top-start",
        disabled: false
      }
    ].filter(item => (item.url && urlArr.includes(item.url)) || !item.url)

    this.tableRowBtnListWithoutEditDel = [
      {
        label: '角色授权',
        methods: 'handleAuthorize',
        url: '/v1/sys/role/grantFunction',
        svgIcon: 'roleauthorize',
        type: '',
        key: 'authorize',
        align: 'top-start',
        disabled: false
      },
      {
        label: '人员分配',
        methods: 'handleFenpei',
        url: '/v1/sys/role/grantRoleToUsers',
        svgIcon: 'rolepersonfenpei',
        type: '',
        key: 'fenpei',
        align: 'top-start',
        disabled: false
      }
    ].filter(item => (item.url && urlArr.includes(item.url)) || !item.url)

    this.DatagroupFenpeiBtns = [
      {
        label: '保存',
        methods: 'handleDatagroupFenpeiSubmit',
        url: '/v1/yq/project/updateDataGroupInfo',
        icon: 'el-icon-circle-check-outline',
        type: 'primary',
        disabled: false
      },
      {
        label: '取消',
        methods: 'handleDatagroupFenpeiCancel',
        url: '',
        icon: 'el-icon-circle-close-outline',
        disabled: false
      }
    ].filter(item => (item.url && urlArr.includes(item.url)) || !item.url)

    // render里的按钮
    this.FenpeiBtns = [
      {
        label: '保存',
        methods: 'handleFenpeiSubmit',
        url: '/v1/sys/role/grantRoleToUsers',
        icon: 'el-icon-circle-check',
        type: 'primary',
        disabled: false
      },
      {
        label: '取消',
        methods: 'handleFenpeiCancel',
        url: '',
        icon: 'el-icon-circle-close',
        disabled: false
      }
    ].filter(item => (item.url && urlArr.includes(item.url)) || !item.url)

    this.AuthorizeBtns = [
      {
        label: '保存',
        methods: 'handleAuthorizeSubmit',
        url: '/v1/sys/role/grantFunction',
        icon: 'el-icon-circle-check',
        type: 'primary',
        disabled: false
      },
      {
        label: '取消',
        methods: 'handleAuthorizeCancel',
        url: '',
        icon: 'el-icon-circle-close',
        disabled: false
      }
    ].filter(item => (item.url && urlArr.includes(item.url)) || !item.url)
  },
  render(h) {
    return (
      <div class='add-table-container handleFileList'>
        {this.renderWrapTable(h)}
        {this.renderDialogForm(h)}
        {this.renderCustom(h)}
        {this.renderUpload(h)}
      </div>
    )
  }
}
</script>

<style lang="scss">
.role-manage {
  .searchPanel {
    display: none;
  }
  .toolPanel {
    .search-input {
      float: right;
      width: 80%;
      .el-input__suffix {
        cursor: pointer;
        border-left: 1px solid #e6e6e6;
      }
    }
  }
}
.roleAuthorLoading {
  background: #000;
  opacity: 0.5;
}
.role-authorize-dialog {
  box-sizing: border-box;
  .el-dialog__body {
    height: 500px;
  }
}
</style>
